<template>
  <div>
    <div>son: {{ money }}</div>
    <button @click="handleClick">update parent money</button>
  </div>
</template>

<script>
// 需求：点击儿子中的按钮让父亲的 money + n

export default {
  props: {
    money: {
      type: Number,
      defaul: 10,
    },
  },
  // 通过这个选项可以明确标记出自定义事件
  // emits: ['updateMoney'],
  setup(props, context) {
    // context 是一个对象，对象内部就有 emit
    // context.emit 就等价于 Vue2 this.$emit
    const handleClick = () => {
      // #1 儿子通过 emit 触发父亲自定义事件的同时并传参
      context.emit('updateMoney', 2)
    }
    return {
      handleClick,
    }
  },
}
</script>
